<div class="professionalColumn-container">
    <header class="professionalColumn-header">
        <div class="isCurrent" translate-context="Dashboard plan title" translate>Current Plan</div>
        <h1>Professional</h1>
        <plan-price data-plan="professional"></plan-price>
    </header>
    <div class="professionalColumn-user">
        <addon-row data-addon="member" data-plan="professional"></addon-row>
    </div>
    <div class="professionalColumn-space">
        <span class="professionalColumn-space-value" translate-context="Dashboard plan information" translate>5 GB Storage / User</span>
        <i class="fa fa-info-circle" pt-tooltip-translate="Click INFO to view total storage for your plan" pt-tooltip-translate-context="Info"></i>
        <button type="button" class="professionalColumn-customize pm_button link" translate-context="Dashboard plan button" translate>Info</button>
    </div>
    <div class="professionalColumn-address">
        <span class="professionalColumn-address-value" translate-context="Dashboard plan information" translate>5 Addresses / User</span>
        <i class="fa fa-info-circle" pt-tooltip-translate="Click INFO to view total number of addresses for your plan" pt-tooltip-translate-context="Dashboard plan detail"></i>
        <button type="button" class="professionalColumn-customize pm_button link" translate-context="Dashboard plan button" translate>Info</button>
    </div>
    <div class="professionalColumn-domain">
        <addon-row data-addon="domain" data-plan="professional"></addon-row>
        <i class="fa fa-info-circle" pt-tooltip-translate="Allows you to host emails for your own domain(s) at ProtonMail, e.g. <u>john.smith@example.com</u>" pt-tooltip-translate-context="Dashboard plan detail" pt-html="true"></i>
    </div>
    <div class="professionalColumn-sending">
        <span translate-context="Dashboard plan information" translate>Unlimited sending</span>
        <i
            class="fa fa-info-circle"
            pt-tooltip-translate-context="Tooltip"
            pt-tooltip-translate="ProtonMail cannot be used for mass emailing or spamming. Legitimate emails are unlimited."></i>
    </div>
    <div class="professionalColumn-labels" translate-context="Dashboard plan information" translate>Unlimited Folders / Labels</div>
    <div class="professionalColumn-support" translate-context="Dashboard plan information" translate>Priority Support</div>
    <div class="professionalColumn-filters" translate-context="Dashboard plan information" translate>Custom Filters</div>
    <div class="professionalColumn-autoresponder" translate-context="Dashboard plan information" translate>Autoresponder</div>
    <div class="professionalColumn-catch-all" translate-context="Dashboard plan information" translate>Catch-all email</div>
    <div class="professionalColumn-members" translate-context="Dashboard plan information" translate>Multi-User Support</div>
    <vpn-row data-plan="professional" class="professionalColumn-vpn"></vpn-row>
    <total-rows data-plan="professional"></total-rows>
    <footer class="professionalColumn-footer">
        <select-plan data-plan="professional"></select-plan>
    </footer>
</div>
